<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>三鑫灯世界 - 电工注册</title>
	<link href="__PUBLIC__/css/bootstrap.min.css" rel="stylesheet">
	<link href="__PUBLIC__/css/gloab.css" rel="stylesheet">
	<link href="__PUBLIC__/css/index2.css" rel="stylesheet">
	<script src="__PUBLIC__/hytn/js/jquery-1.9.1.min.js"></script>
	<script src="__PUBLIC__/layer/layer.js"></script>
	<script src="__PUBLIC__/hytn/js/jquery.form.min.js" type="text/javascript"></script>
	<script src="__PUBLIC__/js/register.js"></script>
	<script src="__PUBLIC__/shop.js"></script>
	<style type="text/css">
		.user-head{width: 1050px;margin: 0 auto;padding-top: 10px;}
		.user-head div{padding-top: 8px; float:left;}
	</style>
</head>
<body class="bgf4">
<div style="padding:30px 0 0 40px;position: absolute;">
	<a href="{:U('index')}" >返回商城首页>></a>
</div>
<div class="user-head">
	<div class="">
		<a href="{:U('index')}">
			<img src="__PUBLIC__/images/logo.png" alt="" id="g_logo" width="120px" height="50px">
		</a>
	</div>
</div>
<div class="login-box f-mt10 f-pb50" style="margin-top: 86px!important;">
	<div class="main bgf">
		<div class="reg-box-pan display-inline">
			<div class="reg-box" id="verifyCheck" style="margin-top:20px;">
				<form method="post" action="{:U('yuangongziliao')}" enctype="multipart/form-data" class="ajax-form" onsubmit="return subtijiao();">
					<div class="part1">
						<div class="alert alert-info" style="width:700px">请上传您的相关证件,我们会在7个工作日内完成审核</div>
						<div class="item col-xs-12">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>真实姓名：</span>
							<div class="f-fl item-ifo">
								<input type="text" name="real_name" maxlength="10" class="txt03 f-r3 required" tabindex="1" data-valid="isNonEmpty||between:2-10||isZh" data-error="真实姓名不能为空||真实姓名长度2-10位||只能输入中文" id="adminNo" />
								<span class="ie8 icon-close close hide"></span>
								<label class="icon-sucessfill blank hide"></label>
								<label class="focus">2-10位，中文真实姓名</label>
								<label class="focus valid"></label>
							</div>
						</div>
						<div class="item col-xs-12">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>身份证号：</span>
							<div class="f-fl item-ifo">
								<input type="text" name="id_number" class="txt03 f-r3 required id_number" tabindex="2" data-valid="isNonEmpty||isCard" data-error="身份证号不能为空||身份证号码格式不正确" maxlength="18" id="phone" />
								<span class="ie8 icon-close close hide"></span>
								<label class="icon-sucessfill blank hide"></label>
								<label class="focus">请填写18位有效身份证号码</label>
								<label class="focus valid id_number_exist"></label>
							</div>
						</div>
						<div class="item col-xs-12">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>注册乡镇：</span>
							<div class="f-fl item-ifo">
								<select  name="province" id="province" style="width:106px;margin-right:10px;" onchange="citys()" required>
									<option value="" >请选择省份</option>
									<volist name="province_list" id="v">
										<option value="{$v.code}" >{$v.name}</option>
									</volist>
								</select>

								<select  name="city" id="city" style="width:106px;margin-right:10px;" onchange="countys()" required>
									<option value="" >请选择城市</option>
								</select>

								<select  name="county" id="county" style="width:106px;margin-right:10px;" onchange="villages()" required>
									<option value="" >请选择县区</option>
								</select>

								<select  name="town" id="towns" style="width:106px;margin-right:10px;" required>
									<option value="" >请选择乡镇</option>
								</select>
							</div>
						</div>
						<div class="item col-xs-12">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>身份证正面：</span>
							<img src="" style="width: 68px; height: 68px; display: none;">
							<div id="form1" style="background:url(__PUBLIC__/img/jia.png);background-size:cover;width: 68px;height: 68px;display: inline-block;vertical-align: middle;">
								<input type='file' id="identity_front" name="identity_front" data-valid="isNonEmpty" data-error="身份证正面不能为空" class="imgInp" style="width: 68px;height: 68px;opacity: 0;" value="123"/>
							</div>
							<label class="focus valid" style="display: none">请上传身份证正面图片</label>
						</div>
						<div class="item col-xs-12">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>身份证反面：</span>
							<img src="" style="width: 68px; height: 68px; display: none;">
							<div id="form1" style="background:url(__PUBLIC__/img/jia.png);background-size:cover;width: 68px;height: 68px;display: inline-block;vertical-align: middle;">
								<input type='file' id="identity_reverse" name="identity_reverse" class="imgInp" style="width: 68px;height: 68px;opacity: 0;" value="123"/>
							</div>
							<label class="focus valid" style="display: none">请上传身份证反面图片</label>
						</div>
						<div class="item col-xs-12" style="margin-top: 10px;">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>电工证正面：</span>
							<img src="" style="width: 68px; height: 68px; display: none;">
							<div id="form2" style="background:url(__PUBLIC__/img/jia.png);background-size:cover;width: 68px;height: 68px;display: inline-block;vertical-align: middle;">
								<input type='file' id="electrician_front" name="electrician_front" class="imgInp" style="width: 68px;height: 68px;opacity: 0;"/>
							</div>
							<label class="focus valid" style="display: none">请上传电工证正面图片</label>
						</div>
						<div class="item col-xs-12" style="margin-top: 10px;">
							<span class="intelligent-label f-fl"><b class="ftx04">*</b>电工证反面：</span>
							<img src="" style="width: 68px; height: 68px; display: none;">
							<div id="form2" style="background:url(__PUBLIC__/img/jia.png);background-size:cover;width: 68px;height: 68px;display: inline-block;vertical-align: middle;">
								<input type='file' id="electrician_reverse" name="electrician_reverse" class="imgInp" style="width: 68px;height: 68px;opacity: 0;"/>
							</div>
							<label class="focus valid" style="display: none">请上传电工证正面图片</label>
						</div>
						<div class="item col-xs-12" style="height:auto">
							<span class="intelligent-label f-fl">&nbsp;</span>
							<p class="f-size14 required"  data-valid="isChecked" data-error="点击阅读并同意条款">
								<input type="checkbox" /><a href="javascript:showoutc();" class="f-ml5">我已阅读并同意条款</a>
							</p>
							<label class="focus valid"></label>
						</div>
						<div class="item col-xs-12" style="margin-top: 30px;">
							<span class="intelligent-label f-fl">&nbsp;</span>
							<div class="f-fl item-ifo">
								<input type="submit" value="立即申请" class="btn btn-blue f-r3" id="btn_part3">
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<div class="m-sPopBg" style="z-index:998;"></div>
<div class="m-sPopCon regcon">
	<div class="m-sPopTitle"><strong>服务协议条款</strong><b id="sPopClose" class="m-sPopClose" onClick="closeClause()">×</b></div>
	<div class="apply_up_content">
    	<pre class="f-r0">
		<strong style="margin-left: 170px;">同意以下服务条款，提交注册信息</strong>
			{$electrician_agreement | htmlspecialchars_decode}
        </pre>
	</div>
	<center><a class="btn btn-blue btn-lg f-size12 b-b0 b-l0 b-t0 b-r0 f-pl50 f-pr50 f-r3" href="javascript:closeClause();">已阅读并同意此条款</a></center>
</div>
<script>

	//第三页的确定按钮
	function subtijiao(){
		if(!verifyCheck._click()){
			return false;
		}
		var identity_front = $('#identity_front').val();
		var identity_reverse = $('#identity_reverse').val();
		var electrician_front = $('#electrician_front').val();
		var electrician_reverse = $('#electrician_reverse').val();
		if(identity_front.length == 0){
			$('#identity_front').parent().parent().find('.valid').show()
			return false;
		}else{
			$('#identity_front').parent().parent().find('.valid').hide()
		}
		if(identity_reverse.length == 0){
			$('#identity_reverse').parent().parent().find('.valid').show()
			return false;
		}else{
			$('#identity_reverse').parent().parent().find('.valid').hide()
		}
		if(electrician_front.length == 0){
			$('#electrician_front').parent().parent().find('.valid').show()
			return false;
		}else{
			$('#electrician_front').parent().parent().find('.valid').hide()
		}
		if(electrician_reverse.length == 0){
			$('#electrician_reverse').parent().parent().find('.valid').show()
			return false;
		}else{
			$('#electrician_reverse').parent().parent().find('.valid').hide()
		}

		var id_number = $('.id_number').val();
		var judge = true;
		$.ajax({
			url:"{:U('id_number_exist')}",
			data:{'id_number':id_number},
			async:false,
			type:'post',
			success:function (e) {
				if(e == 1){  //验证未通过
					$('.id_number_exist').text('该身份证号已存在');
					judge = false;
				}
			}
		});
		if(judge == false){
			return false;
		}
	};

	function showoutc(){$(".m-sPopBg,.m-sPopCon").show();}
	function closeClause(){
		$(".m-sPopBg,.m-sPopCon").hide();
	}
</script>
<script>
	function readURL(input,$this) {
		if (input.files && input.files[0]) {

			var reader = new FileReader();

			reader.onload = function (e) {
//			$this.parent().before($('<img id="blah" src='+e.target.result+' style="width:68px;height:68px;float:left;margin-right:10px"/>'))
				$this.parent().parent().find('img').attr('src', e.target.result).show();
			}
			reader.readAsDataURL(input.files[0]);
		}
	}

	$(".imgInp").change(function(){

		readURL(this,$(this));

	});

	//获取所有的城市
	function citys(){
		//获取被选中的option标签
		var province = $('#province option:selected').val();
		//ajax获取专题下的一级分类
		$.ajax({
			url:"{:U('city')}",
			type:'post',
			async: false,
			data:{province:province},
			success:function(data){
				var city = JSON.parse(data);
				var aa = '<option value="" >请选择城市</option>';
				for(var i=0;i<city.length;i++){
					aa += '<option value="'+city[i].code+'">'+city[i].name+'</option>';
				}
				$('#city').html(aa);
			}
		})
	}

	//获取所有的县区
	function countys(){
		//获取被选中的option标签
		var city = $('#city option:selected').val();
		//ajax获取专题下的一级分类
		$.ajax({
			url:"{:U('county')}",
			type:'post',
			async: false,
			data:{city:city},
			success:function(data){
				var county = JSON.parse(data);
				var aa = '<option value="" >请选择县区</option>';
				for(var i=0;i<county.length;i++){
					aa += '<option value="'+county[i].code+'">'+county[i].name+'</option>';
					$('#county').html(aa);
				}
			}
		})
	}

	//获取所有的县区
	function villages(){
		//获取被选中的option标签
		var county = $('#county option:selected').val();
		//ajax获取专题下的一级分类
		$.ajax({
			url:"{:U('town')}",
			type:'post',
			async: false,
			data:{county:county},
			success:function(data){
				var county = JSON.parse(data);
				var aa = '<option value="" >请选择乡镇</option>';
				for(var i=0;i<county.length;i++){
					aa += '<option value="'+county[i].code+'">'+county[i].name+'</option>';
					$('#towns').html(aa);
				}
			}
		})
	}
</script>
</body>
</html>

